import { createApp } from 'vue'
import { createPinia } from 'pinia'
import App from './App.vue'
import router from './router/index.js'
import store from './store'
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'  // 基础样式
import zhCn from 'element-plus/es/locale/lang/zh-cn' // 直接使用内置语言文件
import axios from 'axios';
import { ElMessage } from 'element-plus'

let app = createApp(App);
// 创建 Pinia 实例
let pinia = createPinia()

if (window.ResizeObserver) {
  const originalResizeObserver = window.ResizeObserver;
  // 重写 ResizeObserver，用 setTimeout 避免同步循环问题
  window.ResizeObserver = class ResizeObserver extends originalResizeObserver {
    constructor(callback) {
      super((entries, observer) => {
        // 异步执行回调，避免阻塞导致的警告
        setTimeout(() => {
          callback(entries, observer);
        }, 0);
      });
    }
  };
}
// ---- axios全局 -------
app.provide("axios", axios);

// axios前置拦截器
axios.interceptors.request.use(config=>{
  //在所有请求中加入认证token
  let token = window.sessionStorage.getItem('token')
  if(token != null){
    config.headers['Authorization'] = token
  }
  return config
},error=>{
  Promise.reject(error)
})
//axios后置拦截器
axios.interceptors.response.use(response=>{
  //当token快过期时，后台会进行延期处理，生成新的token，前台需更换新的token
  let refToken = response.headers['x-token']
  if(refToken){
    //如果有新的token，则替换原有token
    window.sessionStorage.setItem('token',refToken);
    console.log("token续期...")
  }
  console.log("后置拦截",response)
  return response
},error=>{
  console.log('后置拦截错误',error)
  //统一处理服务端的报错
  // router.push('/login');
  return Promise.reject(error);
})

//响应拦截器
axios.interceptors.response.use(
    response => {
        return response;
    },
    error => {
        // 全局错误处理
        if (error.response) {
            const status = error.response.status;
            const message = error.response.data?.msg || error.response.data?.message;
            
            switch (status) {
                case 400:
                    ElMessage.error(message || '请求参数错误');
                    break;
                case 401:
                    ElMessage.error('未授权，请重新登录');
                    router.push('/login');
                    // 可以跳转到登录页
                    break;
                case 403:
                    ElMessage.error('权限不足');
                    break;
                case 404:
                    ElMessage.error('接口不存在');
                    break;
                case 500:
                    ElMessage.error(message || '服务器内部错误');
                    break;
                default:
                    ElMessage.error(message || `请求失败 (${status})`);
            }
        } else if (error.request) {
            ElMessage.error('网络错误，请检查网络连接');
        } else {
            ElMessage.error('请求配置错误');
        }
        
        return Promise.reject(error);
    }
);


// 1. 按需引入ElementPlus组件
// import { ElRadio, ElRadioButton, ElRadioGroup, ElMenu, ElMenuItem, ElSubMenu, ElMenuItemGroup, ElIcon } from 'element-plus'
// 2. 按需引入图标（必须单独安装）
import * as ElementPlusIconsVue from '@element-plus/icons-vue';
// 3. 注册图标组件 正确注册图标的方式
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
  app.component(key, component)
}

// a.引入 echarts 核心模块，核心模块提供了 echarts 使用必须要的接口。
import * as echarts from 'echarts/core';
// b.引入柱状图图表，图表后缀都为 Chart
import { BarChart } from 'echarts/charts';
// c.引入标题，提示框，直角坐标系，数据集，内置数据转换器组件，组件后缀都为 Component
import {
  TitleComponent,
  TooltipComponent,
  GridComponent,
  DatasetComponent,
  TransformComponent
} from 'echarts/components';
// d.标签自动布局、全局过渡动画等特性
import { LabelLayout, UniversalTransition } from 'echarts/features';
// e.引入 Canvas 渲染器，注意引入 CanvasRenderer 或者 SVGRenderer 是必须的一步
import { CanvasRenderer } from 'echarts/renderers';

// f.注册必须的组件
echarts.use([
  TitleComponent,
  TooltipComponent,
  GridComponent,
  DatasetComponent,
  TransformComponent,
  BarChart,
  LabelLayout,
  UniversalTransition,
  CanvasRenderer
]);

app.use(store).use(router).use(pinia).use(ElementPlus,{locale: zhCn}).mount('#app')
